<template>
	<view>
		<navbar  title="商家收益" :isGoBack="true" :isNotice="true" ></navbar>
		
		<view class="">
					<view class="margin-top" style=" padding-bottom: 20rpx;">
		        <view class="cash_top" >
		            <view class="text-df cash_money">可提现余额(元)</view>
		            <view class="text-lg cash_value" style="font-size: 55rpx;">￥ <view > {{incrome.accountMoney?incrome.accountMoney:'0.00'}}</view></view>
		            <navigator class="cash_submit" url="../docash_draw/index?cashType=storage"  open-type="navigate">提现</navigator>  
		            <navigator class="cash_submit" style="background-color: gray;" url="../docash_log/index?cashType=storage"  open-type="navigate">提现记录</navigator>     
		          </view>		
					</view>
		
		      <view class="income">
		        <text class="service_fw text-lg">结算数据</text> 
		        <!-- <view class="text-lg mt-20"><van-icon name="arrow" style="color: {{main_color}};font-size: 38rpx;" /></view>         -->
		      </view>
		      <view class="income_top" style=" background-color: white; padding: 20rpx; ">
		            <view class="income_top_one">
		                <text style="font-size: 26rpx;font-weight: bold;">上月结算金额</text>
		                <text style="margin-top: 10px;color: red;margin-bottom: 10px;">￥{{incrome.lastMonthSettle?filter.formatPrice(incrome.lastMonthSettle):'0.00'}}</text>
		            </view>
		            <view class="income_top_one">
		              <text style="font-size: 26rpx;font-weight: bold;">本月结算金额</text>
		              <text style="margin-top: 10px;color: red;margin-bottom: 10px;">￥{{incrome.MonthSettle?filter.formatPrice(incrome.MonthSettle):'0.00'}}</text>
		            </view>
		      </view> 
		      <view class="income  pt-15">
		        <text class="service_fw text-lg">效果数据</text> 
		        <!-- <view class="text-lg mt-20"><van-icon name="arrow" style="color: {{main_color}};font-size: 38rpx;" /></view>         -->
		      </view>
		      <view class="node-tab">
		        <view class="tab-item" :class="(currentTab == '0' ? 'active' : '')" @click="changeNav(0)">昨天</view>
		        <view class="tab-item" :class="(currentTab == 1 ? 'active' : '')"   @click="changeNav(1)">今天</view>
		        <view class="tab-item" :class="(currentTab == 2 ? 'active' : '')"   @click="changeNav(2)">近7天</view>
		        <view class="tab-item" :class="(currentTab == 3 ? 'active' : '')"   @click="changeNav(3)">近30天</view>  
		      </view>
		      <view class="income_top" style=" background-color: white; ">
		            <view class="income_top_one" style="margin-top:30rpx">
		                <text style="font-size: 26rpx;font-weight: bold;">预计收入(元)</text>
		                <text style="margin-top: 10px;color: red;margin-bottom: 10px;">￥{{filter.formatPrice(money)}}</text>
		            </view>
		            <view class="income_top_one"  style="margin-top:30rpx">
		              <text style="font-size: 26rpx;font-weight: bold;">有效订单数量</text>
		              <text style="margin-top: 10px;color: red;margin-bottom: 10px;">{{order}}</text>
		            </view>
		            <view class="income_top_one"  style="margin-top:30rpx">
		              <text style="font-size: 26rpx;font-weight: bold;">有效订单金额(元)</text>
		              <text style="margin-top: 10px;color: red;margin-bottom: 10px;">￥{{filter.formatPrice(total)}}</text>
		            </view>
		      </view> 
		      <view class="income  pt-15">
		        <text class="service_fw text-lg">实时数据</text> 
		        <view class="text-lg mt-20"></view>  
		        <navigator class="text-lg mt-20"  url="./incomelog/index"  open-type="navigate">		         
				  <u-icon name="arrow-right-double" color="#2B91ED" size="18"></u-icon>
		        </navigator>     
		      </view>
		      <view style=" background-color: white; padding-bottom: 40rpx; ">
		        <view class="new-list-item" v-for="(item,index) in incrome.money_log" wx:key="index">                        
		            <view class="item-tag dis-flex-between">                    
		                <view class="content-deadline mb-15 text-xsl">交易时间：{{item.add_time}}</view>
		                <view class="content-deadline">类型：{{item.info}}</view>                            
		            </view>
		            <view class="item-tag dis-flex-between">
		            <view class="content-deadline mb-15" style="color: red;font-weight: bold;font-size: 28rpx;" v-if="item.style == '1'">+ {{item.affectMoney}}</view>
		            <view class="content-deadline mb-15" style="color: gray;font-weight: bold;font-size: 28rpx;" v-if="item.style == '0'">- {{item.affectMoney}}</view>
		            <view class="content-deadline">余额：{{item.accountMoney}}</view>
		          </view>
		        </view>                
		      </view>			
			</view>
			
			
	</view>
</template>

<script>
	//使用外部js方法
	import filter from '@/utils/addmul.js';	
	export default {
		data() {
			return {
				filter: filter,
				currentTab:1,
				incrome:[],
				money:0.00,
				order:0,
				total:0.00
			}			
		},
		onLoad(){
		    this.gat_income()    
		    	   
		  },
		methods:{			
			//获取效果数量
			get_total(){
			    let money
			    let order
			    let total
			    let currentIndex=this.currentTab
			    if(currentIndex==0){
			      money=this.incrome.last_day.money
			      order=this.incrome.last_day.order
			      total=this.incrome.last_day.ok_money
			    }
			    if(currentIndex==1){
			      money=this.incrome.one_day.money
			      order=this.incrome.one_day.order
			      total=this.incrome.one_day.ok_money
			    }
			    if(currentIndex==2){
			      money=this.incrome.seven_day.money
			      order=this.incrome.seven_day.order
			      total=this.incrome.seven_day.ok_money
			    }
			    if(currentIndex==3){
			      money=this.incrome.thirty_day.money
			      order=this.incrome.thirty_day.order
			      total=this.incrome.thirty_day.ok_money
			    }
			    this.money=money
			    this.order=order
			    this.total=total
			  
			  },
			
			changeNav(type){
				this.currentTab=type
				this.get_total()
			},  
			//获取信息
			gat_income(){
			    let obj_data={
			       token:uni.getStorageSync('userInfo').app_openid,
			       login_type:'app',
			    }
			    this.$http.getUserIncome(obj_data).then(res=>{
			        if(res.resCode=='9999'){
						this.incrome=res.data
			            this.get_total()
			        }
			    })
			}
        }
	}
</script>

<style>
	/* pages/docash/index.wxss */
	
	
	.margin-top{
	 
	  padding: 0 25rpx;
	  /* margin-top: 30rpx; */
	  height: 330rpx;
	   background: #FFF;
	}
	
	
	.cash_top{  
	  position: absolute;    
	  padding:  40rpx 250rpx;
	  font-size: 30rpx;
	 
	  
	}
	.text-lg{
	  margin-bottom: 40rpx;
	  display: flex;
	}
	.cash_money{
	  
	  font-size: 30rpx;
	  margin-left:20rpx ;
	  margin-bottom: 24rpx
	  
	}
	.cash_value{
	  font-size: 30rpx;
	  margin-left:-5rpx ;
	  margin-bottom: 24rpx;
	  color:red;
	}
	.cash_submit{
	    width: 156px;
	    background: #2B91ED;
	    color: #FFFFFF;
	    text-align: center;
	    border-radius: 50rpx !important;
	    font-size: 28rpx;
	    border: 1rpx solid #f3f3f3 !important;
	    padding-top: 15rpx !important;
	    padding-bottom: 15rpx !important;
	    margin-left: -53rpx;
	}
	.income{
	  display: flex;
	  flex-direction: row;
	  justify-content: space-between;
	  margin-top:13rpx; 
	  padding-left:30rpx; 
	  padding-right:15rpx; 
	  padding-top: 20rpx;
	  background-color: white;
	  border-bottom: 1rpx solid #f3f3f3;
	  height: 50rpx;
	 
	  
	}
	.income_top{
	  display: flex;
	  flex-direction: row;
	  justify-content:space-around;
	  color: gray;
	 
	
	}
	
	.income_top_one{
	  display: flex;
	  flex-direction: column;
	  margin-top: 0rpx;
	  font-size: 30rpx;
	}
	
	.node-tab{
	  background-color: #ffffff;
	  height:88rpx;
	  font-size:33rpx;
	  line-height: 88rpx;
	  display: flex;
	  /* margin-top: 10rpx; */
	}
	.node-tab .tab-item{
	  flex:1;
	  text-align: center;
	  /* color: #666; */
	}
	.node-tab .active{
	  color: #ff6700;
	  position: relative;
	}
	.node-tab .active::before{
	  position:absolute;
	  content: " ";
	  bottom:10rpx;
	  left: 50%;
	  transform: translateX(-50%);
	  width: 30rpx;
	  height: 6rpx;
	  background-color: #ff6700;
	  border-radius: 3rpx;
	}
	
	
	.new-list-item {
	  box-sizing:border-box;
	  /* height:260rpx; */
	  position: relative;
	  background-color: #fff;
	  margin-bottom: 20rpx;
	  padding: 20rpx 30rpx 0;
	  display: flex;
	  flex-direction: row;
	  justify-content: space-between;
	}
	
	.new-list-item:last-child {
	  margin-bottom: 0;
	}
	
	.new-list-item view {
	  box-sizing: border-box;
	}
	
	.content-deadline {
	  font-size: 24rpx;
	  color: #495060;
	}

</style>